import React, {FC, useEffect} from 'react';
import {useDispatch} from "react-redux";
import {loginAsync} from '../models/GlobalSlice'
import {useHistory} from "react-router-dom";
import {RouteCompProps} from "central-react-router";

import styles from './Login.module.scss'

interface LoginProps extends RouteCompProps{
}

const Login: FC<LoginProps> = (props) => {
    const {children} = props;
    const dispatch = useDispatch();
    let history = useHistory();

    useEffect(() => {
        console.log('Login 组件挂载完毕!');
    }, []);

    const onClick = (username: string, pwd: string) => {
        // @ts-ignore
        const promise: Promise<any> = dispatch<Promise<any>>(loginAsync(username, pwd));
        promise.then(() => {
            console.log('login suc', props)
            history.push('/MyHome')
        })
    }
    console.log('Login 组件render!');
    return (
        <div>
            <a className={styles.myLink} onClick={() => onClick('admin', '1')}>错误密码登录</a>
            <br/>
            <a className={styles.myLink} onClick={() => onClick('admin', '888888')}>正确密码登录</a>
        </div>
    );
};

export default Login;
